<link rel="stylesheet" href="assets/store/css/goods.css?v=<?= $version ?>">
<link rel="stylesheet" href="assets/common/plugins/umeditor/themes/default/css/umeditor.css">
<div class="row-content am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
            <div class="widget am-cf">
                <form id="my-form" class="am-form tpl-form-line-form" method="post">
                    <div class="widget-body">
                        <fieldset>
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl">后台补发课程卡</div>
                            </div>
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl">基本信息</div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">用户名 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="text" class="tpl-form-input"  value="<?= $user['nickName'];?>" readonly>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">用户手机号 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="text" class="tpl-form-input"  value="<?= $user['phone']?substr_replace($user['phone'],'****',3,4):'未绑定';?>" readonly>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">用户 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <div class="am-form-file">
                                        <div class="am-form-file">
                                            <div class="uploader-list am-cf">
                                                <div class="file-item">
                                                    <a  title="点击查看大图">
                                                        <img src="<?= $user['avatarUrl'] ?>">
                                                    </a>
                                                    <input type="hidden" name="order[user_id]"
                                                           value="<?= $user['user_id'] ?>">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="help-block am-margin-top-sm">
                                            <small>尺寸750x750像素以上，大小2M以下 (可拖拽图片调整显示顺序 )</small>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require"> 选择课程卡 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <select id="cardchange" name="order[course_card_id]"
                                            data-am-selected="{searchBox: 1, btnSize: 'sm', placeholder:'请选择', maxHeight: 400}"
                                            required>
                                        <option value=""></option>
                                        <?php if (isset($list) && !$list->isEmpty()):
                                            foreach ($list as $item): ?>
                                                <option value="<?= $item['id'] ?>" price="<?= $item['price'] ?>" shop="<?= $item['shop']['shop_name'] ?>" type="<?= $item['type'] ?>" num="<?= $item['nums'] ?>" day="<?= $item['days'] ?>"><?= $item['goods_name'] ?></option>
                                            <?php endforeach; endif; ?>
                                    </select>
                                    <div class="help-block">
                                        <small>请选择课程卡</small>
                                    </div>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label">课程类型 </label>
                                <div class="am-u-sm-9 am-u-end course_type">

                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label">所属门店</label>
                                <div class="am-u-sm-9 am-u-end course_shop">

                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label">可使用次数</label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="text" class="tpl-form-input course_num" placeholder="请输入可使用次数" name="order[nums]" value="" onkeyup="value=value.replace(/[^\d]+/g,'')">
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label">有效天数</label>
                                <div class="am-u-sm-9 am-u-end ">
                                    <input type="text" class="tpl-form-input course_day" placeholder="请输入有效天数" name="order[days]" value="" onkeyup="value=value.replace(/[^\d]+/g,'')">
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label">订单金额</label>
                                <div class="am-u-sm-9 am-u-end ">
                                    <input type="text" class="tpl-form-input pay_price" placeholder="请输入订单金额" name="order[pay_price]" value="" onkeyup="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : ''">
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require"> 销售人员 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <select name="order[sale_type]" id="sale_type" data-am-selected="{btnSize: 'sm', placeholder: '人员类型'}">
                                        <option value="2">教练</option>
                                        <option value="1">店员</option>
                                    </select>
                                    <select name="order[sale_id]" id="sale_id"  data-am-selected="{searchBox: 1, btnSize: 'sm', placeholder:'请选择', maxHeight: 400}" >
                                        <option value=""></option>
                                    </select>
                                </div>
                            </div>
                            <!-- 表单提交按钮 -->
                            <div class="am-form-group">
                                <div class="am-u-sm-9 am-u-sm-push-3 am-margin-top-lg">
                                    <button type="submit" class="j-submit am-btn am-btn-secondary">提交
                                    </button>
                                </div>
                            </div>

                        </fieldset>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- 图片文件列表模板 -->
{{include file="layouts/_template/tpl_file_item" /}}

<!-- 文件库弹窗 -->
{{include file="layouts/_template/file_library" /}}

<script src="assets/common/js/vue.min.js"></script>
<script src="assets/common/js/ddsort.js"></script>
<script src="assets/common/plugins/umeditor/umeditor.config.js?v=<?= $version ?>"></script>
<script src="assets/common/plugins/umeditor/umeditor.min.js"></script>
<script src="assets/store/js/goods.spec.js?v=<?= $version ?>"></script>
<script>

    $(function () {
        let coach = <?= $coach;?>;
        let clerk = <?= $clerk;?>;
        function get_list(type){
            var str = `<option value=""></option>`
            if (type === 2){
                coach.forEach(function (item) {
                    str += `<option value="${item.coach_id}">${item.real_name}</option>`
                })
            }else if(type === 1){
                clerk.forEach(function (item) {
                    str += `<option value="${item.clerk_id}">${item.real_name}</option>`
                })
            }

            $("#sale_id").html(str)
        }
        get_list(2)

        $("#sale_type").change(function (e) {
            e.preventDefault()
            var type = parseInt($(this).val())
            get_list(type)
        })
        $("#cardchange").change(function () {
            var shop = $("#cardchange option:selected").attr('shop')
            var type = $("#cardchange option:selected").attr('type')
            var num = $("#cardchange option:selected").attr('num')
            var day = $("#cardchange option:selected").attr('day')
            var price = $("#cardchange option:selected").attr('price')
            var tips
            if (type == 1){
                tips = '次卡';
            }else{
                tips = '团课';
            }
            $(".course_shop").text(shop)
            $(".course_type").text(tips)
            // $(".course_num").text(num+'次')
            $(".course_num").val(num)
            // $(".course_day").text(day+'天')
            $(".course_day").val(day)
            $(".pay_price").val(price)
        })
        // 富文本编辑器
        UM.getEditor('container', {
            initialFrameWidth: 375 + 15,
            initialFrameHeight: 300
        });

        // 选择图片
        $('.upload-file').selectImages({
            name: 'goods[images][]'
            , multiple: true
        });

        // 图片列表拖动
        $('.uploader-list').DDSort({
            target: '.file-item',
            delay: 100, // 延时处理，默认为 50 ms，防止手抖点击 A 链接无效
            floatStyle: {
                'border': '1px solid #ccc',
                'background-color': '#fff'
            }
        });

        // 切换单/多规格
        $('input:radio[name="goods[spec_type]"]').change(function (e) {
            var $goodsSpecMany = $('.goods-spec-many')
                , $goodsSpecSingle = $('.goods-spec-single');
            if (e.currentTarget.value === '10') {
                $goodsSpecMany.hide() && $goodsSpecSingle.show();
            } else {
                $goodsSpecMany.show() && $goodsSpecSingle.hide();
            }
        });

        // 注册商品多规格组件
        var specMany = new GoodsSpec({
            el: '#many-app'
        });

        /**
         * 表单验证提交
         * @type {*}
         */
        $('#my-form').superForm({
            // 获取多规格sku数据
            buildData: function () {
                var specData = specMany.appVue.getData();
                return {
                    goods: {
                        spec_many: {
                            spec_attr: specData.spec_attr,
                            spec_list: specData.spec_list
                        }
                    }
                };
            },
            // 自定义验证
            validation: function () {
                var specType = $('input:radio[name="goods[spec_type]"]:checked').val();
                if (specType === '20') {
                    var isEmpty = specMany.appVue.isEmptySkuList();
                    isEmpty === true && layer.msg('商品规格不能为空');
                    return !isEmpty;
                }
                return true;
            }
        });

    });
</script>
